<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首页作业</title>
    <link rel="stylesheet" href="style.css"/>
    <link rel="stylesheet" href="slider.css"/>
    <Link rel="stylesheet" href="css/tuor.css"/>
    <Link rel="stylesheet" href="css/footer.css"/>
    <!--一定要记住每一次设计新区样式，要加入css表格啊啊啊！！！-->
    <script type="text/javascript" src="js/slider.js"></script>
</head>
<body>
  <!--  <nav id="nav">
        <section class= "center">
            <h1 class= "logo">gitlog标题</h1>
            <ul class= "link">
                <li class="active"><a href="index.html">首页</a></li>
                <li><a href="#">一级标题</a></li>
                <li><a href="#">一级标题</a></li>
                <li><a href="#">一级标题</a></li>
                <li><a href="#">一级标题</a></li>
              
            </ul>
        </section>
    </nav>
   -->  
    
   <header id="header">
    <div class="center">
        <h1 class="logo">logo标题</h1>
        <nav class="link">
            <h1 class="none">网站导航</h1>
            <ul class="wuxu"> <!---->
                <li class="active"><a href="index.html">首页</a>
                  <ul id="xu">
                      <li><a href="about.html">二级</a></li>
                      <li><a href="about.html">二级</a></li>
                  </ul>
                </li>
            </ul>
            <!--第二个ul-->
            <ul class="wuxu">
                <li class="active"><a href="book.html">菜单</a>
                  <ul id="xu">
                      <li><a href="index.html">可爱</a></li>
                      <li><a href="about.html">二级</a></li>
                  </ul>
                </li>
            </ul>
            <!--第3个ul-->
            <ul class="wuxu">
                <li class="active"><a href="about.html">关于</a>
                  <ul id="xu">
                      <li><a href="book.html">二级</a></li>
                      <li><a href="about.html">二级</a></li>
                  </ul>
                </li>
            </ul>
            <!--第4个ul-->
            <ul class="wuxu">
                <li class="active"><a href="book.html">轮播图</a>
                  <ul id="xu">
                      <li><a href="index.html">二级</a></li>
                      <li><a href="about.html">二级</a></li>
                  </ul>
                </li>
            </ul>
            <!--第5个ul-->
            <ul class="wuxu">
                <li class="active"><a href="index.html">花朵</a>
                  <ul id="xu">
                      <li><a href="book.html">二级</a></li>
                      <li><a href="about.html">二级</a></li>
                  </ul>
                </li>
            </ul>
            <button class="button">搜索</button><!--搜索框-->
        </nav>
    </div>    
</header>

<!--<div id="search"></div>-->

<!--轮播图设计-->
<div id="slider">
    <ul class="slieder-item-container" id="ull"><!---->
        <li class="current"><a href="#"><img class="one" src="images/1.jpg" /></a></li>
        <li class="current"><a href="#"><img class="one" src="images/2.jpg" /></a></li>
        <li class="current"><a href="#"><img class="one" src="images/3.jpg" /></a></li>
        <li class="current"><a href="#"><img class="one" src="images/4.jpg" /></a></li>
        <li class="current"><a href="#"><img class="one" src="images/5.jpg" /></a></li>
    </ul>
    <div class="arrow-container"><!--左右按钮-->
        <span class="left-arrow"><</span>
        <span class="right-arrow">></span>
    </div>
    <div class="indicator-container"><!--圆点设置-->
        <span class="indicator active"></span>
        <span class="indicator"></span>
        <span class="indicator"></span>
        <span class="indicator"></span>
        <span class="indicator"></span>
    </div>
</div>
<!--轮播图结束-->

<!--tuor内容区开始-->
<div id="tour">
     <section class="center">
        <h2>内容区设计</h2>
        <p> 国内旅人、美丽风景、海南风景。。。</p>
     </section>

     <!--小可爱图结束-->
       <div id="keai">
           <span><img src="img/spring.jpg"/></span>
           <span><img src="img/summer.jpg"/></span>
           <span><img src="img/winter.jpg"/></span>
           <span><img src="img/summer.jpg"/></span>
           <span><img src="img/winter.jpg"/></span>
           <span><img src="img/spring.jpg"/></span>
       </div>
       <div id="biao">
           <div class="xbiao">spring</div>
           <div class="xbiao">spring</div>
           <div class="xbiao">spring</div>
           <div class="xbiao">spring</div>
           <div class="xbiao">spring</div>
           <div class="xbiao">spring</div>
       </div>

     <!--1号小表格-->
     <figure>
        <img src="./img/tour1.jpg" alt="">
        <figcaption><strong class="title">&lt;曼谷-芭提雅6日游&gt;</strong>抱团特惠，超丰富景点，升级1晚国五，五自费更赠送600元/成人自费卷</figcaption>
        <div class="info">
            <em class="sat">满意度 77%</em>
            <span class="price">¥ <strong>2864元</strong> 起</span>
        </div>
        <div class="type">国内长线</div>
    </figure>
    <!--2号小表格-->
    <figure>
        <img src="./img/tour1.jpg" alt="">
        <figcaption><strong class="title">&lt;曼谷-芭提雅6日游&gt;</strong>抱团特惠，超丰富景点，升级1晚国五，五自费更赠送600元/成人自费卷</figcaption>
        <div class="info">
            <em class="sat">满意度 77%</em>
            <span class="price">¥ <strong>2864元</strong> 起</span>
        </div>
        <div class="type">国内长线</div>
    </figure>
    <!--3号小表格-->
    <figure>
        <img src="./img/tour1.jpg" alt="">
        <figcaption><strong class="title">&lt;曼谷-芭提雅6日游&gt;</strong>抱团特惠，超丰富景点，升级1晚国五，五自费更赠送600元/成人自费卷</figcaption>
        <div class="info">
            <em class="sat">满意度 77%</em>
            <span class="price">¥ <strong>2864元</strong> 起</span>
        </div>
        <div class="type">国内长线</div>
    </figure>
    <!--4号小表格-->
    <figure>
        <img src="./img/tour6.jpg" alt="">
        <figcaption><strong class="title">&lt;曼谷-芭提雅6日游&gt;</strong>抱团特惠，超丰富景点，升级1晚国五，五自费更赠送600元/成人自费卷</figcaption>
        <div class="info">
            <em class="sat">满意度 77%</em>
            <span class="price">¥ <strong>2864元</strong> 起</span>
        </div>
        <div class="type">国内长线</div>
    </figure>
    <!--5号小表格-->
    <figure>
        <img src="./img/tour6.jpg" alt="">
        <figcaption><strong class="title">&lt;曼谷-芭提雅6日游&gt;</strong>抱团特惠，超丰富景点，升级1晚国五，五自费更赠送600元/成人自费卷</figcaption>
        <div class="info">
            <em class="sat">满意度 77%</em>
            <span class="price">¥ <strong>2864元</strong> 起</span>
        </div>
        <div class="type">国内长线</div>
    </figure>
    <!--6号小表格-->  
    <figure>
        <img src="./img/tour6.jpg" alt="">
        <figcaption><strong class="title">&lt;曼谷-芭提雅6日游&gt;</strong>抱团特惠，超丰富景点，升级1晚国五，五自费更赠送600元/成人自费卷</figcaption>
        <div class="info">
            <em class="sat">满意度 77%</em>
            <span class="price">¥ <strong>2864元</strong> 起</span>
        </div>
        <div class="type">国内长线</div>
    </figure>

    <!--小熊猫图标开始-->
     <div id="mao">
        <dl class="thr">
            <dt class="rig1"><img src="img/熊猫2.jpg"/></dt>
            <dd class="rig2"><a class="xj" href="#">《随风潜入夜，润物细无声，随风潜入夜，润物细无声，可爱的小熊猫</a></dd>
        </dl>
    
        <dl class="thr">
            <dt class="rig1"><img src="img/熊猫2.jpg"/></dt>
            <dd class="rig2"><a class="xj" href="#">《随风潜入夜，润物细无声，随风潜入夜，润物细无声，可爱的小熊猫</a></dd>
        </dl>

        <dl class="thr">
            <dt class="rig1"><img src="img/熊猫2.jpg"/></dt>
            <dd class="rig2"><a class="xj" href="#">《随风潜入夜，润物细无声，随风潜入夜，润物细无声，可爱的小熊猫</a></dd>
        </dl>


     </div>
    <!--小熊猫图标开始-->
</div>
<!--tuor内容区结束-->

<!--页脚区开始-->
<footer id="footer">

     <div class="fo1">
        <div class="block left">
            <h2>何柳慧@__@</h2>
            <hr>
            <ul>
                <li>途牛旅游网</li>
                <li>驴妈妈旅游网</li>
                <li>携程旅游</li>
                <li>中国青年旅行社</li>
            </ul>
        </div>
        <div class="block center">
            <h2>何柳慧@__@</h2>
            <hr>
            <ul>
                <li>旅游合同签订有哪些？</li>
                <li>儿童票有半价优惠吗？</li>
            </ul>
        </div>
        <div class="block right">
            <h2>何柳慧@__@</h2>
            <hr>
            <ul>
                <li>微博: weibo.com/zzz</li>
                <li>邮件: lpz2@163.com</li>
                <li>地址: 广西桂林</li>
            </ul>
        </div>
    </div>
     </div>

     <div class="fo2">Copyright © 18300206|网络工程1802班级|何柳慧：何柳慧</div>
</footer>
<!--页脚区结束-->


</body>
</html>